<style lang="less">
@import '../../../styles/common.less';
</style>

<template>
    <div class='main_item'>
        <div @click="dataShow('collectLogData')" id="moxx" class="main_item_title">
            <span style="font-weight:bold;" icon="md-arrow-dropdown">催收日志</span>
            <span style="float:right">
                <Icon type="md-arrow-dropdown" id="collectLogData_icon"></Icon>
            </span>
        </div>
        <div id="collectLogData" class="main_item_content_block">
            <div style="margin:30px 10px 10px 10px;">
              <Table border :columns="logColumns" :data="logData" style="width: 100%;"></Table>
              <div style="text-align: center;margin-top: 36px;">
                  <Page :total="comptParams.total" :current="comptParams.pageNum" :page-size="comptParams.pageSize" size="small" show-elevator show-sizer show-total @on-change="pageChange" @on-page-size-change="sizeChange"></Page>
              </div>
            </div>
        </div>
      </div>
</template>

<script>
export default {
  name: 'collect-log',
  data () {
    return {
      comptParams: {
        loanId: '',
        overdueCode: '',
        pageNum: 1,
        pageSize: 10,
        total: 0
      },
      logColumns: [
        {
          title: '创建时间',
          key: 'createdDate',
          align: 'center',
          render: (h, params) => {
            var vm = this
            return h('div', [
              h('span', vm.$util.loanModularFormatTime(params.row.createDate))
            ])
          }
        },
        {
          title: '联系人',
          key: 'contactPersion',
          align: 'center'
        },
        {
          title: '联系方式',
          key: 'contactType',
          align: 'center'
        },
        {
          title: '行动名称',
          key: 'actionName',
          align: 'center'
        },
        {
          title: '承诺金额',
          key: 'promiseAmount',
          align: 'center'
        },
        {
          title: '承诺日期',
          key: 'promiseData',
          align: 'center',
          render: (h, params) => {
            var vm = this
            return h('div', [
              h('span', vm.$util.loanModularFormatTime(params.row.commitDate))
            ])
          }
        },
        {
          title: '约会日期时间',
          key: 'meetDate',
          align: 'center',
          render: (h, params) => {
            var vm = this
            return h('div', [
              h('span', vm.$util.loanModularFormatTime(params.row.meetDate))
            ])
          }
        },
        {
          title: '操作员',
          key: 'actionUser',
          align: 'center'
        },
        {
          title: '行动结果',
          key: 'actionStatusName',
          align: 'center'
        },
        {
          title: '备注',
          key: 'remarks',
          align: 'center'
        }
      ],
      logData: []
    }
  },
  computed: {
    avatorImage () {
      return localStorage.avatorImgPath
    }
  },

  created () {
    // 初始化当前页面请求对象实例
    this.$ajax = this.$util.ajax()
    this.initData()
  },
  methods: {
    dataShow: function (tagId) {
      var clickTag = document.getElementById(tagId)
      if (clickTag.className === 'main_item_content') {
        clickTag.className = 'main_item_content_block'
        document.getElementById(tagId + '_icon').className = 'ivu-icon ivu-icon-md-arrow-dropup'
      } else {
        clickTag.className = 'main_item_content'
        document.getElementById(tagId + '_icon').className = 'ivu-icon ivu-icon-md-arrow-dropdown'
      }
    },
    pageChange: function (pageNum) {
      var vm = this
      vm.comptParams.pageNum = pageNum
      vm.listQuery()
    },
    sizeChange: function (pageLength) {
      var vm = this
      vm.comptParams.pageSize = pageLength
      vm.initData()
    },
    initData () {
      var vm = this
      vm.comptParams.loanId = this.collectTaskParams.loanId
      vm.comptParams.overdueCode = this.collectTaskParams.overdueCode
      this.$ajax.post(this.$appContext.marvels_core_financial + 'financial/collection/manage/service/actionInfoList', vm.comptParams).then(re => {
        var data = re.data
        vm.logData = data.data.list
        vm.comptParams.total = data.data.total
      }).catch(er => {

      })
    }
  },
  props: {
    collectTaskParams: Object
  }
}
</script>
